fix: dashboard top level tabs edit #19722
Merged
+57
−34
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
SUMMARY
This PR addresses several small issues detected when editing the top level tabs in the dashboard.
The main problem behind them is that the tab & the content, being different components, were not 100% in sync after re-order/add/remove actions on them.
This PR hoists the state handling up for this scenarios and ensure the state is driven in the same way.
BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Issue 1
When adding a new tab, the container gets selected & the "Collapse tab content" popup appears.
Before:
collapse-msg.mov
After:
Screen.Recording.2022-04-14.at.13.16.11.mov
Issue 2
When adding a new tab, said tab is selected, but the content still reflects the one from a previous tab
Before:
add-tab-content-does-not-change.mov
After:
Screen.Recording.2022-04-14.at.13.17.22.mov
Issue 3
Reordering tabs makes the tab & content out of sync, so the current tab content is lost.
Before:
switch-tabs-content.mov
After:
Screen.Recording.2022-04-14.at.13.18.25.mov
Issue 4
Deleting a tab always switches to the last one. This should only happen if the tab being deleted is the current one the user is seeing, otherwise, nothing should change.
Before:
delete-switches-tab.mov
After:
Screen.Recording.2022-04-14.at.13.20.07.mov
TESTING INSTRUCTIONS
Check each individual "Before" video for reproduction steps
ADDITIONAL INFORMATION